<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="static/assets/global/plugins/bootstrap/css/bootstrap.min.css"/>
	<link rel="stylesheet" type="text/css" href="static/assets/global/css/components.css"/>
	<link rel="stylesheet" type="text/css" href="static/assets/admin/pages/css/login.css"/>
	<script type="text/javascript" src="static/assets/global/plugins/jquery-1.11.0.min.js"></script>
	<title></title>

</head>
<body class="login">
	<div class="content">
		<h3 class="form-title">商品详情</h3>
		<!-- 仅在有秒杀活动时显示 -->
		<div id="promoStartTimeContainer" class="form-group">
			<label style="color: blue" id="promoStatus" class="control-label"></label>
			<div>
				<label style="color: red" class="control-label" id="promoStartTime"/>
			</div>
		</div>
		<div class="form-group">
			
			<div>
				<label class="control-lable" id="title"/>
			</div>
		</div>
		<div class="form-group">
			<label class="control-label">商品描述</label>
			<div>
				<label class="control-lable" id="description"/>
			</div>
		</div>
		<div id="normalprice" class="form-group">
			<label class="control-label">价格</label>
			<div>
				<label class="control-label" id="price"/>
			</div>
		</div>
		<!-- 仅在有秒杀活动时显示 -->
		<div id="promoPriceContainer" class="form-group">
			<label style="color: red" class="control-label">秒杀价格</label>
			<div>
				<label style="color: red" class="control-label" id="promoPrice"/>
			</div>
		</div>
		<div class="form-group">
		
			<div>
				<img style="width: 200px;height: auto;" id="imgUrl" />
			</div>
		</div>
		<div class="form-group">
			<label class="control-label">库存</label>
			<div>
				<label class="control-label" id="stock" />
			</div>
		
		</div>
		<div class="form-group">
			<label class="control-label">销量</label>
			<div>
				<label class="control-label" id="sales" />
			</div>
		
		</div>
		<div class="form-actions">
			<button class="btn blue" id="createorder" type="submit">
				下单
			</button>
			
		</div>
</body>
<script>


	function getParam(paramName) {
	    paramValue = "", isFound = !1;         
	    if (this.location.search.indexOf("?") == 0 && this.location.search.indexOf("=") > 1) {               
	       arrSource = unescape(this.location.search).substring(1, this.location.search.length).split("&"), i = 0;               
	        while (i < arrSource.length && !isFound) arrSource[i].indexOf("=") > 0 && arrSource[i].split("=")[0].toLowerCase() ==  paramName.toLowerCase() && (paramValue = arrSource[i].split("=")[1], isFound = !0), i++  }
	        	
	        return paramValue == "" && (paramValue = null), paramValue 
	}


	var g_itemVO = {}

	jQuery(document).ready(function(){
			
			//下单ajax请求
			$("#createorder").on("click",function(){

				$.ajax({
					type:"POST",
					contentType:"application/x-www-form-urlencoded",
					url:"http://localhost:8090/order/createorder",
					xhrFields:{withCredentials:true},
					data:{
						"itemId":g_itemVO.id,
						"amount":1,
						"promoId":g_itemVO.promoId
					},
					success:function(data){
						if(data.status =="success"){
							alert("下单成功！");
							window.location.reload();
						}else{
							alert("下单失败！原因为"+data.data.errMsg);
							if(data.data.errCode=="20002")
								window.location.href="login.html";
						}

					},
					error:function(data){
						alert("下单失败！原因为"+data.responseText);
					}
				});


			});



			//获取商品详情
			$.ajax({
				type:"GET",
				
				url:"http://localhost:8090/item/get",
				xhrFields:{withCredentials:true},
				data:{
					"id":getParam("id"),
				},
				success:function(data){
					if(data.status =="success"){
						g_itemVO = data.data;
						reloadDom();
						/*设置一个定时器，到秒杀时间后，自动放开下单按钮*/
						/*每隔1秒钟，执行一次*/
						setInterval(reloadDom,1000);
					}else{
						alert("获取商品详情失败！原因为"+data.data.errMsg);
					}

				},
				error:function(data){
					alert("获取商品详情失败！原因为"+data.responseText);
				}
			});
			
		});

	function reloadDom(){
		$("#title").text(g_itemVO.title);
		$("#description").text(g_itemVO.description);
		$("#stock").text(g_itemVO.stock);
		$("#price").text(g_itemVO.price);
		$("#imgUrl").attr("src",g_itemVO.imgUrl);
		$("#sales").text(g_itemVO.sales);

		//秒杀还未开始，展示开始时间
		if(g_itemVO.promoStatus == 1){
			
			var startTime = g_itemVO.startTime.replace(new RegExp("-","gm"),"/");
			//转为毫秒
			startTime = (new Date(startTime)).getTime();
			//当前时间转为毫秒
			var nowTime = Date.parse(new Date());
			var delta = (startTime-nowTime)/1000;

			//活动开始了
			if(delta<=0){

				g_itemVO.promoStatus = 2;
				reloadDom();

			}

			$("#promoStartTime").text("该商品将于"+g_itemVO.startTime+"开始秒杀 倒计时："+delta+"秒");
			//展示秒杀价格
			$("#promoPrice").text(g_itemVO.promoPrice);
			//临近秒杀，将正常下单按钮禁用
			$("#createorder").attr("disabled",true);

		//秒杀正在进行
		}else if(g_itemVO.promoStatus == 2){
			$("#promoStartTime").text("秒杀正在进行...");
			//展示秒杀价格
			$("#promoPrice").text(g_itemVO.promoPrice);
			//秒杀正在进行，放开下单按钮
			$("#createorder").attr("disabled",false);
			//将原价隐藏掉
			$("#normalprice").hide();
		}


	}
	

</script>
</html>